<template>
	<view>
		<view class="h10"></view>
		<view class="">
			<view class="p20 flex bg-fff" @click="$jump('inform',{type:item.type})" v-for="(item,index) in inform"
				:key="index">
				<view class="w96 h96 pr">
					<u-badge is-center :count="item.num||0"></u-badge>
					<image :src="item.icon" class="wh-max" mode=""></image>
				</view>
				<view class="flex1  ml24 ov-h als-s border-b">
					<view class="flex row-between">
						<view class="flex1 line-1">{{item.name}}</view>
						<view class="fs24 color-999">{{item.time}}</view>
					</view>
					<view class="line-1 color-999 mt10">{{item.content}}</view>
				</view>
			</view>
		</view>
		<view class="pt30 pl30 pb16 color-666">消息通知</view>
		<view class="">
			<u-empty mode="message" marginTop="100" v-if="!list.length"></u-empty>
			<view class="p20 flex bg-fff" v-for="(item,index) in list" :key="index"
				@click="$jump('chat',{to_identify:item.to_identify,to_id:item.to_id})">
				<view class="w96 h96 pr">
					<u-badge is-center :count="item.count||0"></u-badge>
					<u-avatar :src="item.avatar||''" size="96"></u-avatar>
				</view>
				<view class="flex1 ml24 ov-h als-s border-b">
					<view class="flex row-between ">
						<view class="flex1 line-1">{{item.remarks||item.name}}</view>
						<view class="fs24 color-999">{{item.create_time}}</view>
					</view>
					<view class="line-1 color-999 mt10">{{item.content}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: '',
				data: '',
			};
		},
		computed: {
			inform() {
				let data = this.data || ""
				return [{
						name: '系统通知',
						icon: '/static/img/msg/system.png',
						num: data.announce?.unread,
						time: data.announce?.create_time,
						content: data.announce?.name || "~",
						type: 'system'
					}
					// , {
					// 	name: '消息通知',
					// 	icon: '/static/img/msg/msg.png',
					// 	num: data.interact_msg?.unread,
					// 	time: data.interact_msg?.add_time,
					// 	content: data.interact_msg?.name || "~",
					// 	type: 'cash'
					// },
				]
			}
		},
		onLoad() {
			this.getIndex()
			this.getList()
		},
		onReachBottom() {
			this.getList('down')
		},
		methods: {
			getIndex() {
				this.$request('/master/message/index').then(res => {
					this.data = res.data
				})
			},
			getList(e) {
				e == 'down' ? this.page++ : this.page = 1
				let api = '/master/message/messageList'
				this.$request(api, {
					page: this.page
				}).then(res => {
					let list = res.data?.data || ''
					e == 'down' ? this.list.push(...list) : this.list = list
				})
			},
		}
	}
</script>

<style lang="scss">

</style>